<template>
	<div class="machineDeployTemplate-add-update-component">
		<el-dialog
				v-if="modelValue.visible"
				v-model="modelValue.visible"
				:title="
        !modelValue.form.id
          ? `新增${modelValue.title}`
          : `修改${modelValue.title}`
      "
				width="550px"
		>
			<div style="padding-right: 50px; padding-top: 20px">
<el-form
		:model="modelValue.form"
		:rules="modelValue.rules"
		ref="addEditRef"
		:label-width="100"
>
	<el-form-item label="管路序号（从1开始排序）" prop="pipelineSeq">
		<el-input
				placeholder="请输入管路序号（从1开始排序）"
				v-model="modelValue.form.pipelineSeq"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="料仓名称" prop="siloName">
		<el-input
				placeholder="请输入料仓名称"
				v-model="modelValue.form.siloName"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="绑定物料ID（关联material表）" prop="materialId">
		<el-input
				placeholder="请输入绑定物料ID（关联material表）"
				v-model="modelValue.form.materialId"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="是否无限量(0-否 1-是)" prop="isUnlimited">
		<el-input
				placeholder="请输入是否无限量(0-否 1-是)"
				v-model="modelValue.form.isUnlimited"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="料仓容量（单位：千克，无限量时填NULL）" prop="capacity">
		<el-input
				placeholder="请输入料仓容量（单位：千克，无限量时填NULL）"
				v-model="modelValue.form.capacity"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="料仓分组（A/B/C类分组）" prop="siloGroup">
		<el-input
				placeholder="请输入料仓分组（A/B/C类分组）"
				v-model="modelValue.form.siloGroup"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="清洗分组（空值表示不分组）" prop="cleaningGroup">
		<el-input
				placeholder="请输入清洗分组（空值表示不分组）"
				v-model="modelValue.form.cleaningGroup"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="创建人" prop="createdBy">
		<el-input
				placeholder="请输入创建人"
				v-model="modelValue.form.createdBy"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="更新人" prop="updatedBy">
		<el-input
				placeholder="请输入更新人"
				v-model="modelValue.form.updatedBy"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="" prop="createdAt">
		<el-input
				placeholder="请输入"
				v-model="modelValue.form.createdAt"
				autocomplete="off"
		/>
	</el-form-item>
	<el-form-item label="" prop="updatedAt">
		<el-input
				placeholder="请输入"
				v-model="modelValue.form.updatedAt"
				autocomplete="off"
		/>
	</el-form-item>

</el-form>
			</div>
			<template #footer v-if="!modelValue.form.disabled">
        <span class="dialog-footer">
          <el-button @click="cancel">取消</el-button>
          <el-button type="primary" @click="ensure"> 确定 </el-button>
        </span>
			</template>
		</el-dialog>
	</div>
</template>
<script  setup lang='ts'>
	import { ref, onMounted } from "vue";
	import { ElMessage, FormInstance } from "element-plus";
	import { addMachineDeployTemplate, updateMachineDeployTemplate } from "@/api/dms-machine-deploy-template.api";

	const props = defineProps(["modelValue"]);
	const addEditRef = ref<FormInstance>();

	/***
	 * 确认弹框
	 */
	const ensure = () => {
		let form = props.modelValue.form;
		let formData = {
																				pipelineSeq: form.pipelineSeq,
																	siloName: form.siloName,
																	materialId: form.materialId,
																	isUnlimited: form.isUnlimited,
																	capacity: form.capacity,
																	siloGroup: form.siloGroup,
																	cleaningGroup: form.cleaningGroup,
																	createdBy: form.createdBy,
																	updatedBy: form.updatedBy,
																	createdAt: form.createdAt,
																	updatedAt: form.updatedAt,
																};

		if (!addEditRef.value) return;
		addEditRef.value.validate((valid, fields) => {
			if (valid) {
				if (form.id) {
					updateMachineDeployTemplate({
						...formData,
						id: form.id,
					})
							.then((res) => {
								cancel();
								ElMessage({
									message: props.modelValue.title + "修改成功",
									type: "success",
								});
								if (props.modelValue.refreshDataList) {
									props.modelValue.refreshDataList();
								}
							})
							.catch((err) => {
								ElMessage({
									message: err.msg || err,
									type: "error",
								});
							});
					return;
				}

				addMachineDeployTemplate(formData)
						.then((res) => {
							cancel();
							ElMessage({
								message: props.modelValue.title + "新增成功",
								type: "success",
							});
							if (props.modelValue.refreshDataList) {
								props.modelValue.refreshDataList();
							}
						})
						.catch((err) => {
							ElMessage({
								message: err.msg || err,
								type: "error",
							});
						});
			}
		});
	};

	/***
	 * 取消弹框
	 */
	const cancel = () => {
		props.modelValue.visible = false;
	};

</script>
<style lang='scss' scoped>
</style>
